<template>
  <div class="content">
    <el-button type="primary" @click="showCoordinateMap()">显示地图</el-button>
    <el-button type="primary" @click="showUpload()">显示上传</el-button>

    <div class="mapBox">
      <CoordinateMap v-if="mapVisible" @getLnglat="getLnglat"></CoordinateMap>
    </div>
    <!-- <div class="mapBox">
      <MapIndex v-if="mapVisible" :default-value="postForm.detailedAddress" @getPosition="getPosition"></MapIndex>
    </div> -->

    <div class="mapBox">
      <UploadFilesDialog v-if="uploadVisible"></UploadFilesDialog>
    </div>

    <div class="block">
      <span class="demonstration">单选可搜索</span>
      <el-cascader
      v-model="test"
      ref="cascaderAddr"
        placeholder="试试搜索：指南"
        @change="handleChange"
        :options="options"
        filterable
        clearable
      ></el-cascader>
    </div>


    <div class="block">
      <span class="demonstration">单选可搜索</span>
      <el-cascader
      v-model="test2"
      ref="cascaderAddr2"
        placeholder="试试搜索：指南"
        @change="handleChange2"
        :options="options2"
        filterable
        clearable
      ></el-cascader>
    </div>

  </div>
</template>
<script>
import CoordinateMap from "@/components/map/CoordinateMap";
import MapIndex from "@/components/map/MapIndex";
import UploadFilesDialog from "@/components/uploadFiles/UploadFilesDialog";

export default {
  components: {
    CoordinateMap,
    UploadFilesDialog,
    MapIndex
  },
  data() {
    return {
      mapVisible: false,
      uploadVisible: false,

      test: "",
      test2: "",

      options: [],
      options2: [],

      postForm: {
        detailedAddress: '',
        longitude: '',
        latitude: ''
      }
    };
  },
  created() {
    this.options = this.$INDUSTRY;
    this.options2 = this.$WASTE;
    // this.getSig();
  },
  mounted() {
    
    // console.log(this.$moment(new Date()).format("YYYYMDHms"))
    // for (let i = 0; i < 10; i++) {
    //   console.log(i+'i ', this.uuid())
    // }
    this.$ge.$on("map-close-finish", () => {
      this.mapVisible = false;
      // this.search();
    });
    let that = this;
    this.$ge.$on("upload-file-close-finish", (fileList) => {
      that.uploadVisible = false;
      // this.search();
    });

    this.test = "1530"

    // this.formatJson();
  },
  methods: {
    // 获取地址信息
    getPosition({ address, lat, lng, name }) {
      this.postForm.detailedAddress = address;
      this.postForm.longitude = String(lng);
      this.postForm.latitude = String(lat);

    },
    showCoordinateMap() {
      this.mapVisible = true;
    },
    showUpload() {
      this.uploadVisible = true;
    },
    getLnglat(lnglnt) {
    },

    // 获取省市区地址级联
    handleChange(e, form, thsAreaCode) {
        thsAreaCode = this.$refs['cascaderAddr'].getCheckedNodes()[0].pathLabels// 注意2： 获取label值
        console.log(thsAreaCode.join(",")) // 注意3： 最终结果是个一维数组对象
        // console.log(thsAreaCode[0] + thsAreaCode[1] + thsAreaCode[2])
    },

    handleChange2(e, form, thsAreaCode) {
        thsAreaCode = this.$refs['cascaderAddr2'].getCheckedNodes()[0].pathLabels// 注意2： 获取label值
        console.log(thsAreaCode.join(",")) // 注意3： 最终结果是个一维数组对象
        // console.log(thsAreaCode[0] + thsAreaCode[1] + thsAreaCode[2])
    },

    formatJson() {
      //[{ value: }]
      let wasList = [];

      // this.options2.forEach(element => {
      //   if(element['行业来源']) {
      //     wasList.push(
      //       {
      //         value: 1,
      //         label: element['行业来源'],
      //         children: []
      //       }
      //     )
      //   }
      //   console.log(element)
      // });
    }

  },
};
</script>
<style lang="sass" scoped>
</style>
